import { useState } from "react";
import style from "./MusicPlayModules.module.scss";
function MusicPlayModules() {
	const [isHovered, setIsHovered] = useState(false);

	const handleMouseEnter = () => {
		setIsHovered(true);
	};

	const handleMouseLeave = () => {
		setIsHovered(false);
	};

	const [lock, setLock] = useState(false);

	const handleLock = () => {
		setLock(!lock);
	};
	return (
		<div
			className={`${style.play} ${lock ? style.lock : ""}`}
			onMouseEnter={handleMouseEnter}
			onMouseLeave={handleMouseLeave}
		>
			<h1 onClick={handleLock}>{String(lock)}lock</h1>
		</div>
	);
}
export default MusicPlayModules;
